<template>
	<view class="css-page" :style="[{'backgroundColor': bgColor}]">
		<!-- <uv-navbar :bgColor="bgColor" leftIconColor="#FFFFFF" titleStyle="color:#FFFFFF;font-size:14px;"
			leftIcon="arrow-left" :autoBack="true" :title="navbarTitle" safeAreaInsetTop fixed placeholder></uv-navbar> -->
		<view v-if="!isEmpty(topPic)">
			<image mode="widthFix" style="width: 100vw;" :src="topPic"></image>
		</view>
		<view class="css-margin-lr-sm css-padding-top css-bg-white css-radius-xl">
			<view class="css-padding">
				<view>
					<uv-search placeholder="请输入喜欢的数字" height="40" :clearabled="true" :showAction="true"
						v-model="nowSymbol" @custom="search" @search="search" @clear="nowSymbol=''"></uv-search>
				</view>

				<view class="css-margin-top css-flex-x css-flex-wrap css-justify-start css-align-center css-gap">
					<view v-for="(name,index) in ruleTypeList" :key="index">
						<uv-button :type="nowSymbol==name?'warning':'info'" :plain="nowSymbol==name?false:true"
							:hairline="true" :text="name" @click="search(name)"></uv-button>
					</view>
					<view>
						<uv-button type="warning" :plain="true" :hairline="true"
							:text="ruleMore?'收起':'更多('+allRuleTypeList.length+')'" ></uv-button>
					</view>
				</view>

			</view>
		</view>
		<view class="css-margin-top css-padding-bottom css-bg-white css-margin-lr-sm css-radius-xl">
			<template v-if="pageNum>0 && isEmpty(numberData)">
				<uv-empty mode="data"></uv-empty>
			</template>
			<template v-else>
				<cu-number-list :rows="numberData"></cu-number-list>
			</template>
			<view class="css-margin-top css-flex-x css-align-center css-justify-center css-gap">
				<view>
					<uv-button type="warning" text="上一页" :disabled="pageNum<=1?true:false"
						@click="upPage()"></uv-button>
				</view>
				<view>
					<uv-button type="warning" text="下一页" :disabled="pageEnd" @click="nextPage()"></uv-button>
				</view>
			</view>
		</view>
		<view class="css-margin-top css-margin-lr-sm">
			<uv-parse :content="data.goods_detail"></uv-parse>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				navbarTitle: '号码详情',
				bgColor: '#0081ff',
				topPic: '',
				screenWidth: uni.screenWidth,
				goodsId: 0,
				data: [],
				ruleTypeList: [],
				numberData: [],
				allRuleTypeList: [],
				partRuleTypeList: [],
				ruleMore: false,
				nowSymbol: '',
				serverHost: '',
				pageNum: 0,
				pageEnd: false
			}
		},
		onShow() {
			let nowApp = getApp();
			// console.log(nowApp)
			if (true === uni.$uv.getProperty(nowApp, 'globalData.reInit')) {
				getApp().globalData.reInit = false;
				console.log('重新执行init');
				this.init();
			}
		},
		onLoad(options) {
			options = options || {};
			this.goodsId = options.id || 0
			this.nowSymbol = options.symbol || ''
			this.serverHost = uni.$my.serverHost
			this.init()
		},
		methods: {
			isEmpty(item) {
				return uni.$uv.test.empty(item)
			},
			getProperty(obj, key) {
				return uni.$uv.getProperty(obj, key);
			},
			dumpPage(page, params, type) {
				uni.$my.dumpPage(page, params, type)
			},
			init() {
				// console.log(uni.$my.serverHost)
				uni.$uv.http.get('/goods/detail', {
					params: {
						id: this.goodsId
					}
				}).then(res => {
					if (res.code === 200) {
						if (!this.isEmpty(res.data.goods_detail)) {
							res.data.goods_detail = decodeURIComponent(res.data.goods_detail)
						}
						if (!this.isEmpty(res.data.goods_remark)) {
							res.data.goods_remark = decodeURIComponent(res.data.goods_remark)
						}
						this.data = res.data
						this.topPic = this.getProperty(res, 'data.detail_top_pic')
						if (!this.isEmpty(this.topPic)) {
							this.topPic = this.serverHost + this.topPic
						}
						if (!this.isEmpty(res.data.detail_bg_color)) {
							this.bgColor = res.data.detail_bg_color
						}
	

						this.$nextTick(() => {
							this.search(this.nowSymbol)
						})
					}
					// console.log(this.adpic)
				}).catch(e => {
					console.log(e)
				})
			},

			search(symbol) {
				this.nowSymbol = symbol || ''
				this.pageNum = 1
				this.pageEnd = false
				this.doSearch()
			},
			upPage() {
				this.pageNum -= 1
				this.doSearch()
			},
			nextPage() {
				this.pageNum += 1
				this.doSearch()
			},
			doSearch() {
				uni.showLoading({
					title: '加载更多号码...'
				})
				uni.$uv.http.get('/goods/search', {
					params: {
						goodsId: this.goodsId,
						symbol: this.nowSymbol,
						pageNum: this.pageNum
					}
				}).then(res => {
					uni.hideLoading()
					if (res.code === 200) {
						if (this.isEmpty(res.data)) {
							this.pageEnd = true
							this.numberData = []
							uni.showToast({
								title: '没有更多数据了',
								icon: 'none'
							})
						} else {
							this.pageEnd = false
							this.numberData = res.data
						}
					}
					// console.log(this.adpic)
				}).catch(e => {
					uni.hideLoading()
					console.log(e)
				})
			},
			copyIt(txt) {
				uni.$my.copyIt(txt).then(res => {
					uni.showToast({
						title: '内容已复制',
						icon: 'none'
					})
				}).catch(e => {

				})
			}
		}
	}
</script>

<style>

</style>